<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@page import="java.util.UUID"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@taglib uri="/struts-tags" prefix="s"%>
<html>
	<head>
		<base href="<%=basePath%>">
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>Insert title here</title>

		<link rel="stylesheet" href="/manager/style/css/screen.css"
			type="text/css" media="screen, projection" />

		<link rel="stylesheet" type="text/css"
			href="/manager/style/css/superfish.css" media="screen">

		<script type="text/javascript"
			src="/manager/style/js/jquery-1.4.2.min.js">
</script>

		<script type="text/javascript" src="/manager/style/js/superfish.js">
</script>

		<script type="text/javascript">
function change_add_navi_url() {
	var type_text	= $("#add_navi_type").val();
	var key			= $("#add_navi_key").val();

	if ( type_text == "page" ) {
		$("#add_navi_url").val("/pageAction?naviKey=" + key);
	}
	else if ( type_text == "news" ) {
		$("#add_navi_url").val("/newsAction?naviKey=" + key);
	}
	else if ( type_text == "goods" ) {
		$("#add_navi_url").val("/goodsAction?naviKey=" + key);
	}
	else if ( type_text == "parentRoot" ) {
		$("#add_navi_url").val("#");
	}
	else if ( type_text == "custom" ) {
		$("#add_navi_url").val("http://");
	}
}
		
jQuery(function($) {
	$(".show_tr").click(function() {

		$(this).text($(this).text() == "打开操作" ? "关闭操作" : "打开操作");
		var $div = $(this).parents("tr").next().find(".show_tr_div");

		$div.slideToggle();
		//$tr2.slideToggle("slow");
		});

	$('ul.sf-menu').superfish();

	$("#add_navi_button").click(function() {
		$("#add_navi_div").slideToggle();
	});
	
	$("#add_navi_type").change( change_add_navi_url );
	
	change_add_navi_url();
});


</script>

	</head>
	<body>

		<div class="right_context container">

			<div class="span-16">

				<fieldset>
					<legend>
						导航列表
					</legend>

					<table class="span-15">
						<thead>
							<tr>
								<th class="span-3">
									名称
								</th>
								<th class="span-3">
									父节点
								</th>
								<th class="span-1">
									类型
								</th>
								<th class="span-2">
									显示
								</th>
								<th class="span-2">
									排序
								</th>
								<th class="span-4">
									操作
								</th>
							</tr>
						</thead>

						<tbody>

							<s:iterator value="naviList" var="m">


								<tr>
									<td>
										<s:property value="#m.displayName" />
									</td>
									<td>
										<s:if test="%{#m.parentKey == ''}">
												无父节点
										</s:if>
										<s:else>
											<s:iterator value="naviList" var="n">

												<s:if test="%{#n.keyString == #m.parentKey}">
													<s:property value="#n.displayName" />
												</s:if>
											</s:iterator>
										</s:else>
									</td>
									<td>
										<s:if test="%{#m.type == 'news'}">
											新闻
										</s:if>
										<s:elseif test="%{#m.type == 'goods'}">
											商品
										</s:elseif>
										<s:elseif test="%{#m.type == 'page'}">
											简介
										</s:elseif>
										<s:elseif test="%{#m.type == 'custom'}">
											自定义
										</s:elseif>
										<s:elseif test="%{#m.type == 'parentRoot'}">
											父节点
										</s:elseif>

									</td>
									<td>
										<s:if test="%{#m.boolDisplay}">
											是
										</s:if>
										<s:else>
											否
										</s:else>
									</td>
									<td>
										<s:property value="#m.sort" />
									</td>
									<td>
										<button class="show_tr">打开操作</button>
									</td>
								</tr>
								<tr>
									<td colspan="6" style="padding: 0;">

										<div class="show_tr_div" style="display: none;">
											<form name="naviupdate<s:property value="#m.keyString" />"
												action="/manager/navi-updateNavi.action" method="post">
												<table>
													<tr>
														<td class="span-3">
															<input type="text" name="navi.displayName"
																value="<s:property value="#m.displayName" />"
																class="span-2" />
															<input type="text" name="navi.keyString"
																style="display: none;"
																value="<s:property value="#m.keyString" />" />
														</td>
														<td class="span-3">
															<select name="navi.parentKey" class="span-2">
																<option value="">
																	无父节点
																</option>

																<s:iterator value="naviList" var="n">
																	<s:if
																		test="%{#n.type == 'parentRoot' && #n.parentKey == ''}">
																		<s:if test="%{#n.keyString == #m.parentKey}">
																			<option value="<s:property value="#n.keyString" />"
																				selected="selected">
																				<s:property value="#n.displayName" />
																			</option>
																		</s:if>
																		<s:else>
																			<option value="<s:property value="#n.keyString" />">
																				<s:property value="#n.displayName" />
																			</option>
																		</s:else>
																	</s:if>
																</s:iterator>

															</select>
														</td>
														<td class="span-1">
															<select name="navi.type" class="span-2">


																<s:if test="%{#m.type == 'news'}">
																	<option value="news">
																		新闻
																	</option>
																</s:if>
																<s:elseif test="%{#m.type == 'goods'}">
																	<option value="goods">
																		商品
																	</option>
																</s:elseif>
																<s:elseif test="%{#m.type == 'page'}">
																	<option value="page">
																		简介
																	</option>
																</s:elseif>
																<s:elseif test="%{#m.type == 'custom'}">
																	<option value="custom">
																		自定义
																	</option>
																</s:elseif>
																<s:elseif test="%{#m.type == 'parentRoot'}">
																	<option value="parentRoot">
																		父节点
																	</option>
																</s:elseif></select>
														</td>
														<td class="span-2">
															<s:if test="%{#m.boolDisplay}">
																<input type="checkbox" name="navi.boolDisplay"
																	value="<s:property value="true" />" checked="checked"
																	class="span-1" />
															</s:if>
															<s:else>
																<input type="checkbox" name="navi.boolDisplay"
																	value="<s:property value="true" />" class="span-1" />
															</s:else>
														</td>
														<td class="span-2">
															<s:select
																list="#{1:1,2:2,3:3,4:4,5:5,6:6,7:7,8:8,9:9,10:10,11:11,12:12}"
																name="navi.sort" value="#m.sort" />
														</td>
														<td class="span-4">
															<a href="#"
																onclick="javascript:naviupdate<s:property value="#m.keyString" />.submit();return false">修改</a>
														</td>
													</tr>
													<tr>
														<td colspan="5">
															<input type="text" name="navi.url"
																value="<s:property value="#m.url" />" class="span-6" />
														</td>
														<td>
															<a onclick="javascript:return confirm('确认删除？')"
																href="/manager/navi-deleteNavi.action?keyString=<s:property value="#m.keyString" />">删除</a>
														</td>
													</tr>
												</table>
											</form>
										</div>

									</td>
								</tr>



							</s:iterator>

						</tbody>
					</table>


				</fieldset>

				<div class="span-16">

					<fieldset>
						<legend>
							导航预览
						</legend>

						<ul class="sf-menu">
							<s:iterator value="naviList" var="n">
								<s:if test="%{#n.parentKey == ''}">
									<li>
										<a><s:property value="#n.displayName" /> </a>
										<s:if test="%{#n.type == 'parentRoot'}">
											<ul>
												<s:iterator value="naviList" var="l">
													<s:if test="%{#l.parentKey == #n.keyString}">
														<li>
															<a><s:property value="#l.displayName" /> </a>
														</li>
													</s:if>
												</s:iterator>
											</ul>
										</s:if>
									</li>
								</s:if>
							</s:iterator>
						</ul>

					</fieldset>

				</div>


				<div class="span-16">

					<fieldset>
						<legend>
							<button id="add_navi_button">
								点击增加导航节点
							</button>
						</legend>

						<div id="add_navi_div" style="display: none;">
							<form action="/manager/navi-addNavi.action" method="post">
								<table class="cute_form">
									<tr>
										<td style="text-align: right;">
											请选择父节点
										</td>
										<td>
											<select name="navi.parentKey">
												<option value="">
													无父节点
												</option>
												<s:iterator value="naviList" var="n">
													<s:if
														test="%{#n.type == 'parentRoot' && #n.parentKey == ''}">
														<option value="<s:property value="#n.keyString" />">
															<s:property value="#n.displayName" />
														</option>
													</s:if>
												</s:iterator>
											</select>
										</td>
									</tr>
									<tr>
										<td style="text-align: right;">
											新建导航名称(惟一，不可重复)
										</td>
										<td>
											<input type="hidden"" name="navi.keyString" id="add_navi_key"
												value="<%=UUID.randomUUID().toString().substring(0,8) %>" />
											<input type="text" name="navi.displayName" value="" />
										</td>
									</tr>
									<tr>
										<td style="text-align: right;">
											是否显示
										</td>
										<td>
											<input type="checkbox" name="navi.boolDisplay" value="true"
												checked="checked" />
										</td>
									</tr>
									<tr>
										<td style="text-align: right;">
											显示顺序(填数字)
										</td>
										<td>
											<s:select
												list="#{1:1,2:2,3:3,4:4,5:5,6:6,7:7,8:8,9:9,10:10,11:11,12:12}"
												name="navi.sort" value="6" />
										</td>
									</tr>
									<tr>
										<td style="text-align: right;">
											导航类型
										</td>
										<td>
											<select name="navi.type" id="add_navi_type">
												<option value="page">
													简介
												</option>
												<option value="news">
													新闻
												</option>
												<option value="goods">
													商品
												</option>
												<option value="parentRoot">
													父节点
												</option>
												<option value="custom">
													自定义
												</option>
											</select>
										</td>
									</tr>
									<tr>
										<td style="text-align: right;">
											导航链接
										</td>
										<td>
											<input type="text" name="navi.url" id="add_navi_url"
												value="http://localhost:8888/#" />
										</td>
									</tr>
									<tr>
										<td></td>
										<td>
											<input type="submit" value="提交此节点" />
										</td>
									</tr>
								</table>
							</form>

						</div>

					</fieldset>

				</div>


			</div>

		</div>


	</body>
</html>
